import AntModal from '@/components/pt/dialog/AntModal'
import SelectRegion from '@/views/platform/components/SelectRegion'
import { getApproveConfig, addApproveConfig, updateApproveConfig } from '@/api/platform/approveConfig'
import { randomUUID } from '@/utils/util'
export default {
  name: 'CreateForm',
  props: {
    itemId: {
      type: String,
      required: false
    },
    statusOptions: {
      type: Array,
      required: true
    },
    methodOptions: {
      type: Array,
      required: true
    }
  },
  components: {
    AntModal,
    SelectRegion
  },
  data() {
    return {
      open: false,
      closeDialog: true,
      spinning: false,
      delayTime: 100,
      labelCol: { span: 4 },
      wrapperCol: { span: 14 },
      loading: false,
      disabled: false,
      modelItemDisabled: false,
      total: 0,
      id: undefined,
      formTitle: '添加审核配置表',
      // 表单参数
      form: {},
      // 非多个禁用
      multiple: true,
      // 非单个禁用
      single: true,
      // 选中的主键集合
      selectedRowKeys: [],
      // 选中的数据集合
      selectedRows: [],
      // 选中数组
      ids: [],
      sentenceList: [],
      cacheSentenceList: [],
      columns: [
        {
          title: '值',
          dataIndex: 'value',
          width: '80%',
          ellipsis: true,
          scopedSlots: { customRender: 'value' }
        },
        {
          title: '操作',
          dataIndex: 'operation',
          width: '20%',
          scopedSlots: { customRender: 'operation' }
        }
      ],
      rules: {
        name: [{ required: true, message: '审核配置名称不能为空', trigger: 'blur' }],
        itemId: [{ required: true, message: '审核配置项目ID不能为空', trigger: 'blur' }],
        method: [{ required: true, message: '请选择审核方式', trigger: 'blur' }],
        status: [{ required: true, message: '请选择审核状态', trigger: 'blur' }]
      }
    }
  },
  filters: {},
  created() {},
  computed: {},
  watch: {},
  mounted() {},
  methods: {
    validaData() {
      let flag = true
      this.sentenceList.forEach(item => {
        if (item.value === '' || item.value === 'undefined' || item.value === null) {
          this.$message.info('请先维护值为空的数据！')
          flag = false
        } else {
          this.cacheSentenceList.unshift(item)
        }
      })
      return flag
    },
    batchDedeleteRow() {
      this.selectedRows.forEach(item => {
        this.deleteRow(item)
      })
    },
    deleteRow(record) {
      const newData = [...this.sentenceList]
      const newCacheData = [...this.cacheSentenceList]
      const target = newData.filter(item => record.id !== item.id)
      const targetCache = newCacheData.filter(item => record.id !== item.id)
      if (target) {
        this.sentenceList = target
        this.cacheSentenceList = targetCache
      }
    },
    addRow() {
      if (this.validaData()) {
        const newRow = {
          id: randomUUID(),
          value: '',
          editable: true
        }
        // 关闭所有已打卡行编辑
        this.closeEditCell(this.sentenceList)
        this.sentenceList.unshift(newRow)
      }
    },
    saveRow(record) {
      if (this.validaData()) {
        const newData = [...this.sentenceList]
        record.editable = false
        const target = newData.find(item => record.id === item.id)
        this.cacheSentenceList.unshift(target)
      }
    },
    closeEditCell(data) {
      // 关闭所有打开的可编辑行
      const list = data.filter(item => item.editable === true)
      list.forEach(item => {
        item.editable = false
      })
    },
    cancelEditCell(record) {
      const newData = [...this.sentenceList]
      const newCacheData = [...this.cacheSentenceList]
      const target = newData.find(item => record.id === item.id)
      const targetCache = newCacheData.find(item => record.id === item.id)
      if (target && targetCache) {
        record.value = targetCache.value
        record.editable = false
      } else {
        this.sentenceList = newData.filter(item => record.id !== item.id)
      }
    },
    updateRow(record) {
      record.editable = true
    },
    /** 翻页操作 */
    onSelectChange(selectedRowKeys, selectedRows) {
      this.selectedRowKeys = selectedRowKeys
      this.selectedRows = selectedRows
      this.ids = this.selectedRows.map(item => item.id)
      this.single = selectedRowKeys.length !== 1
      this.multiple = !selectedRowKeys.length
    },
    onClose() {
      this.open = false
      this.reset()
      this.$emit('close')
    },
    // 取消按钮
    cancel() {
      this.open = false
      this.reset()
      this.$emit('close')
    },
    // 表单重置
    reset() {
      this.form = {
        id: undefined,
        name: undefined,
        itemId: this.itemId,
        method: undefined,
        sentence: undefined,
        status: '0'
      }
    },
    /** 判断是否有项目 */
    judgeItem() {
      if (this.itemId !== undefined) {
        this.modelItemDisabled = !this.modelItemDisabled
      }
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset()
      this.judgeItem()
      this.open = true
      this.formTitle = '添加审核配置表'
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset()
      this.judgeItem()
      this.open = true
      this.spinning = !this.spinning
      const approveConfigId = row.id
      this.form.itemId = row.itemId
      getApproveConfig(approveConfigId).then(response => {
        this.form = response.data
        this.setSentenceList()
        this.formTitle = '修改审核配置表'
        this.spinning = !this.spinning
      })
    },
    setSentenceList() {
      const list = this.form.sentence.split(',')
      list.forEach((value, index) => {
        this.sentenceList.push({ id: index, value: value, editable: false })
        this.cacheSentenceList.push({ id: index, value: value, editable: false })
      })
    },
    setFormSentence() {
      let str = ''
      this.sentenceList.forEach((item, index) => {
        if (index != this.sentenceList.length - 1) {
          str += item.value + ','
        } else {
          str += item.value
        }
      })
      return str
    },
    /** 提交按钮 */
    submitForm: function (closeDialog) {
      this.closeDialog = closeDialog
      this.disabled = true
      this.$refs.form.validate(valid => {
        if (valid) {
          this.form.sentence = this.setFormSentence()
          console.log(this.setFormSentence())
          const saveForm = JSON.parse(JSON.stringify(this.form))
          if (this.form.id !== undefined) {
            updateApproveConfig(saveForm).then(response => {
              this.$message.success('更新成功', 3)
              this.open = false
              this.$emit('ok')
              this.$emit('close')
              this.disabled = false
            })
          } else {
            addApproveConfig(saveForm).then(response => {
              this.$message.success('新增成功', 3)
              this.open = false
              this.$emit('ok')
              this.$emit('close')
              this.disabled = false
            })
          }
        } else {
          this.disabled = false
          return false
        }
      })
    },
    back() {
      const index = '/platform/approveconfig/index'
      this.$router.push(index)
    }
  }
}
